<template>
  <div v-if="items.length > 0" class="flex flex-col">
    <ul>
      <li v-for="(item, i) in items" :key="i">
        <a
          :href="item.href"
          class="flex px-4 py-2 hover:bg-gray-900 hover:text-white text-sm"
          :class="i === 0 ? 'border-t-0' : 'border-t'"
          >{{ item.title }}</a
        >
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  props: {
    items: {
      type: Array,
      default: () => [],
    },
  },
};
</script>
